<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Document</title>
	<!-- 引入ajax库：ajax.js -->
	<script src="ajax.js"></script>
	<script type="text/javascript">
	    window.onload = function(){
	    	var oBtn = document.getElementById('btn1');
	    	oBtn.onclick = function(){
                //点击按钮，调用ajax函数  格式：ajax(url,fnSucc,fnFail); 路径可写相对路径也可以写绝对路径
                ajax('abc.txt',function(str){    //执行成功时返回的回调函数
                    alert(str);   //执行成功
                },function(){
                	alert('失败');  //执行失败
                });
                

                //自己编写ajax
                //1、创建ajax对象
                //window.   预防报错 表示window下的属性
                // if(window.XMLHttpRequest){
                // 	var oAjax = new XMLHttpRequest(); //兼容非IE6的其他浏览器
                // }else{
                // 	var oAjax = new ActiveXObject("Microsoft.XMLHTTP"); //兼容IE6
                // }

                // //2、连接服务器
                // //open(方法，文件名，异步传输)
                // //方法：GET或者POST，文件名：读取文件路径，异步传输：true异步，false同步
                // oAjax.open('GET','abc.txt',true); 

                // //阻止缓存，可以在文件名后面加参数，每次访问的不是一样的页面
                // //oAjax.open('GET','abc.txt?t='+new Date.getTime(),true); 
                
                // //3、发送请求
                // oAjax.send();

                // //4、接收返回值
                // //onreadystateschange：接收返回，与服务器交互时出发生的事件
                // oAjax.onreadystatechange = function(){
                // 	//readystatus  浏览器和服务器进行到哪一步了  有0,1,2,3,4等值
                // 	if(oAjax.readyState == 4){       //4表示读取完成，完成不代表成功
                //         if(oAjax.status == 200){  //200表示读取成功
                //         	alert('成功：'+oAjax.responseText);   //responseText响应文本，就是执行成功返回的信息
                //         }else{
                //         	alert('失败：'+oAjax.status);  //弹出错误提示 404找不到文件
                //         }
                // 	}
                // }
	    	}
	    }
        
	</script>
</head>
<body>
   
   <input id="btn1" type="button" value="读取" />
	
</body>
</html>